<template>
  <m-page>
    <!-- 签约信息页 -->
    <m-header title="签约"></m-header>
    <ynet-button-tab :items="items" @change="handleChange"></ynet-button-tab>
    <!-- 我的合同 -->
    <ul class="sign_list_ul"  v-if="isFlag === 1">
      <li class="sign_list_li">
        <div class="sign_list_img">
          <img src alt width="20%" />
        </div>
        <div class="sign_list_money">
          <span>贷款总金额(元)</span>
          <span>本期应还(元)</span>
        </div>
        <div class="sign_list_money">
          <span class="money1">5000000</span>
          <span class="money2">5000000</span>
        </div>
        <div class="sign_list_sign">
          <span>待签约</span>
        </div>
        <div class="sign_list_icon">
          <ynet-icon name="arrow-right"></ynet-icon>
        </div>
      </li>
       <li class="sign_list_li">
        <div class="sign_list_img">
          <img src alt width="20%" />
        </div>
        <div class="sign_list_money">
          <span>贷款总金额(元)</span>
          <span>本期应还(元)</span>
        </div>
        <div class="sign_list_money">
          <span class="money1">5000000</span>
          <span class="money2">5000000</span>
        </div>
        <div class="sign_list_sign">
          <span>待签约qqqq</span>
        </div>
        <div class="sign_list_icon">
          <ynet-icon name="arrow-right"></ynet-icon>
        </div>
      </li>
    </ul>
    <!-- 关联合同 -->
    <ul class="sign_list_ul0" v-if="isFlag === 2">
      <li class="sign_list_li0">
        <div class="sign_list_pepple">
          <span>借款人姓名</span>
          <span>身份证号码</span>
          <span>业务品种</span>
          <span>贷款金额(元)</span>
          <span>期限(月)</span>
           <span>客户经理姓名</span>
        </div>
        <div class="sign_list_produce">
          <span>大荣</span>
          <span>456312166711237789</span>
          <span>xxxx</span>
          <span>5,000,000</span>
          <span>36</span>
           <span>张三</span>
        </div>
         <div class="sign_list_view">
           <span class="sign_list_nosign">未签约</span>
           <ynetButton type="primary" size='small'>签约</ynetButton>
        </div>
      </li>
      <li class="sign_list_li0">
        <div class="sign_list_pepple">
          <span>借款人姓名</span>
          <span>身份证号码</span>
          <span>业务品种</span>
          <span>贷款金额(元)</span>
          <span>期限(月)</span>
           <span>客户经理姓名</span>
        </div>
        <div class="sign_list_produce">
          <span>大荣</span>
          <span>456312166711237789</span>
          <span>xxxx</span>
          <span>5,000,000</span>
          <span>36</span>
           <span>张三</span>
        </div>
         <div class="sign_list_view">
           <span class="sign_list_nosign">未签约</span>
           <ynetButton type="primary" size='small'>签约</ynetButton>
        </div>
      </li>
    </ul>
  </m-page> 
</template>

<script> 
import ynetButtonTab from "@components/button-tab";
import ynetIcon from "@components/icon/index";
import ynetButton from "@components/button/index";
export default {
  components: {
    ynetButtonTab,
    ynetIcon,
    ynetButton
  },
  data() {
    return {
      items: [{ text: "我的合同", id: 1 }, { text: "关联合同", id: 2 }],
      isFlag: 1
    };
  },
  methods: {
    handleChange(item) {
      this.isFlag = item.id
    }
  },
  created() {},
  mounted() {},
  watch: {},
  computed: {}
};
</script>

<style lang="scss" scoped>
@import "./index.scss";
</style>

